<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--网页的标题：显示在浏览器窗口名-->
    <title>Title</title>
</head>
<body>

<!--
标签分类：
    1.根据是否有标签体进行分类
       成对标签（有主体标签）：  例如：<h1>标题</h1>
       单标签体（没有主体的标签）： 例如 <hr />
    2.根据标签是否独占一行进行分类：
        内联标签：不会有换行       例如：span标签
        块标签：会换行，独占一行，  例如：h1~h6
-->

<!--h1~h6,网页内容标题标签：显示在网页内容上
    显示特点：文字加粗，并且独占一行
              数字越大字体越小， 也是块标签，有主体的标签
-->
<h1>标题</h1>
<h2>标题</h2>
<h3>标题</h3>
<h4>标题</h4>
<h5>标题</h5>
<h6>标题</h6>

<!--hr：水平线标签
    属性size： 设置线的粗细
    属性color： 设置线的颜色
        写法1：单词字符串方式，例如 red, green, blue ...
        写法2：rgb格式，由红色、绿色和蓝色组成的颜色，例如 rgb(100,0,99)
        写法3：十六进制的格式，例如 #EEFF00(简写：#EF0)
    属性width： 设置线的占父标签的宽度
        写法1：占父标签的百分比，例如： 100%
        写法2：像素的写法，例如： 200px
    属性align：设置对齐方式
        值1：center, 居中对齐
        值2：left, 左对齐
        值3：right, 右对齐
-->
<hr size="10" color="red" width="100%">
<hr size="10" color="rgb(100,0,99)" width="100%">
<hr size="10" color="#EEFF00" width="100%">
<hr size="10" color="#EF0" width="100%">
<hr size="10" color="#00FF00" width="100%">
<hr size="10" color="#0F0" width="100%">
<hr size="10" color="#0F0" width="200px" align="center">
<hr size="10" color="#0F0" width="200px" align="left">
<hr size="10" color="#0F0" width="200px" align="right">

<!--font： 字体标签，html5中已过时，但是可以使用，以后会被span替代
    属性color： 字体的颜色
    属性size： 字体的大小， 范围1~7
    属性face： 字体的类型，例如：“宋体”，“隶书”...
    特点：内联标签

-->
我们今天开始<font color="green" size="7" face="微软雅黑">学习前端</font>技术了<br />

<!--
b标签： 加粗，bold
br标签：换行标签, <br /> 单标签体标签
-->
我们今天开始<font color="green" size="7" face="微软雅黑"><b>学习前端</b></font>技术了<br />

<!--
i标签：设置斜体，italic
-->
我们今天开始<font color="green" size="7" face="微软雅黑"><b><i>学习前端</i></b></font>技术了<br />

<!--
p标签：段落标签 paragraph， 块标签
使用实体字符：&nbsp;  空格，1个空格1个字节，目前使用的utf-8, 一个汉字占3个字节
空2个汉字：6个&nbsp; 暂时这样用，以后学习了css一句代码搞定
title属性：当鼠标移动到段落上显示的提示文字
-->
<p title="好一个段落">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！
    今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！
    今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！</p>
<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！
    今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！
    今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！今天天气还好，学习的兴趣越好！</p>
</body>
</html>